<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
    <meta http-equiv="Pragma" content="no-cache"/>
    <meta http-equiv="Expires" content="0"/>
    <title>燃气消耗</title>
    <link rel="stylesheet" href="../../../assets/libs/layui/css/layui.css"/>
    <link rel="stylesheet" href="../../../assets/module/admin.css?v=317"/>
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        .layui-row {
            margin: 0px;
        }

        .layui-card {
            margin-bottom: 2px;
        }

        .layui-col-md2 {
            width: 19%;
            margin: 2px;
        }
        input::-webkit-inner-spin-button {
            -webkit-appearance: none;
        }
        input[type="number"]{
            -moz-appearance: textfield;
        }
    </style>
</head>
<body>
<!-- 加载动画 -->
<div class="page-loading">
    <div class="ball-loader">
        <span></span><span></span><span></span><span></span>
    </div>
</div>
<!-- 正文开始 -->
<form class="layui-form" id="formAdvForm" lay-filter="formAdvForm">
    <div class="layui-form-item layui-row">
        <div class="layui-card">
            <div class="layui-card-body">
                <div class="layui-row">
                    <div class="layui-col-md3">
                        <label class="layui-form-label layui-form-required">上次抄表日期:</label>
                        <div class="layui-input-block">
                            <input name="topDate" class="layui-input"
                                   lay-verType="tips" lay-verify="required" autocomplete="off" required id="topDate"/>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <label class="layui-form-label layui-form-required">上次抄表时间:</label>
                        <div class="layui-input-block">
                            <select name="topTime">
                                <option value=""></option>
                                <option value="8:00">8:00</option>
                                <option value="20:00">20:00</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <label class="layui-form-label layui-form-required">本次抄表日期:</label>
                        <div class="layui-input-block">
                            <input name="addDate" class="layui-input"
                                   lay-verType="tips" lay-verify="required" autocomplete="off" required id="addDate"/>
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <label class="layui-form-label layui-form-required">本次抄表时间:</label>
                        <div class="layui-input-block">
                            <select name="addTime">
                                <option value=""></option>
                                <option value="8:00">8:00</option>
                                <option value="20:00">20:00</option>
                            </select>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-form-item layui-row">
        <div class="layui-card layui-col-md2" id="west">
            <div class="layui-card-header">西表</div>
            <div class="layui-card-body">
                <div class=" layui-row">
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">上次读数:</label>
                        <div class="layui-input-block">
                            <input name="topValue" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">本次读数:</label>
                        <div class="layui-input-block">
                            <input name="value" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card layui-col-md2" id="east">
            <div class="layui-card-header">东表</div>
            <div class="layui-card-body">
                <div class=" layui-row">
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">上次读数:</label>
                        <div class="layui-input-block">
                            <input name="topValue" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">本次读数:</label>
                        <div class="layui-input-block">
                            <input name="value" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card layui-col-md2" id="big">
            <div class="layui-card-header">大线</div>
            <div class="layui-card-body">
                <div class=" layui-row">
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">上次读数:</label>
                        <div class="layui-input-block">
                            <input name="topValue" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">本次读数:</label>
                        <div class="layui-input-block">
                            <input name="value" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                    <!--<div class="layui-form-item layui-block">-->
                        <!--<label class="layui-form-label layui-form-required">修正值:</label>-->
                        <!--<div class="layui-input-block">-->
                            <!--<input name="fixValue" class="layui-input" type="number"-->
                                   <!--value="0"-->
                                   <!--lay-verType="tips" lay-verify="number" autocomplete="off" required/>-->
                        <!--</div>-->
                    <!--</div>-->
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">消耗:</label>
                        <div class="layui-input-block">
                            <input name="useValue" class="layui-input" type="number"
                                   value="0"
                                   lay-verType="tips" disabled lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card layui-col-md2" id="middle">
            <div class="layui-card-header">中线</div>
            <div class="layui-card-body">
                <div class=" layui-row">
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">上次读数:</label>
                        <div class="layui-input-block">
                            <input name="topValue" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">本次读数:</label>
                        <div class="layui-input-block">
                            <input name="value" class="layui-input" type="number"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">修正值:</label>
                        <div class="layui-input-block">
                            <input name="fixValue" class="layui-input" type="number"
                                   value="0"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">消耗:</label>
                        <div class="layui-input-block">
                            <input name="useValue" class="layui-input" type="number"
                                   value="0"
                                   lay-verType="tips" disabled lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card layui-col-md2" id="support">
            <div class="layui-card-header">辅助</div>
            <div class="layui-card-body">
                <div class=" layui-row">
                    <div class="layui-form-item layui-block">
                        <label class="layui-form-label layui-form-required">读数:</label>
                        <div class="layui-input-block">
                            <input name="value" class="layui-input" type="number"
                                   value="0"
                                   lay-verType="tips" lay-verify="number" autocomplete="off" required/>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div>
        <div  class="layui-row">
            <div class="layui-col">大线消耗：大线差-中线补偿</div>
            <div class="layui-col">中线消耗：西表差+东表差+辅助读数-大线消耗</div>
            <div class="layui-col">
                <button type="reset" class="layui-btn layui-btn-primary">&emsp;重置&emsp;</button>
                <a class="layui-btn" lay-filter="formAdvSubmit" lay-submit>&emsp;提交&emsp;</a>
            </div>
        </div>

    </div>
</form>
<div class="layui-card">
    <div class="layui-card-header">记录日志</div>
    <div class="layui-card-body">
        <form class="layui-form">
            <div class="layui-form-item" style="float: right">
                <label class="layui-form-label">记录日期:</label>
                <div class="layui-input-inline" style="width: 25em">
                    <input  class="layui-input" name="searchDate" id="searchDate">
                </div>
                <a class="layui-btn" lay-filter="search" lay-submit>查询</a>

            </div>
        </form>
        <div class="layui-row">
            <table id="formAdvTable" lay-filter="formAdvTable"></table>
        </div>
    </div>
</div>
</div>
<script type="text/javascript" src="../../../assets/libs/layui/layui.js"></script>
<script type="text/javascript" src="../../../assets/js/common.js?v=317"></script>
<script type="text/javascript" src="../../../assets/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="../../../assets/js/js.cookie.min.js"></script>
<script type="text/javascript" src="../../../assets/js/sqjx.js"></script>
<script>
    var storeName;
    var form;
    var wathcList = [];
    layui.use(['layer', 'form', 'table', 'laydate'], function () {
        var layer = layui.layer;
        form = layui.form;
        var table = layui.table;
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#topDate', //指定元素
            type: 'date',
            format: 'yyyy-MM-dd',
            trigger: 'click'
        });

        laydate.render({
            elem: '#searchDate', //指定元素
            type: 'datetime',
            range:true,
            trigger: 'click'
        });
        //执行一个laydate实例
        laydate.render({
            elem: '#addDate', //指定元素
            type: 'date',
            format: 'yyyy-MM-dd',
            trigger: 'click'
        });
        var res = getGasDict();
        wathcList = res.obj;
        form.render('select')
        getTopUseLog();
        var insTb = table.render({
            elem: '#formAdvTable',
            url: '/report/gasRecord/queryGasRecordList',
            page: true,
            request: {
                pageName: 'page',
                limitName: 'rows',
            },
            where: {
                watchIdStr: wathcList.map(item => {
                    return item.dictCode
                }).join(",")
            },
            cellMinWidth: 100,
            cols: [[
                {
                    field: 'crtDate', title: '记录时间', align: 'center',width: 180, templet(row) {
                        return row['0'].addDate

                    }
                },
                {
                    field: '', title: '西表', align: 'center', width: 120, templet(row) {
                        var value;
                        Object.keys(row).map(item => {
                            if (row[item].gasWatch == 5) {
                                value = row[item].value;
                            }
                        })
                        return value;
                    }
                },
                {
                    field: 'addDate', title: '东表', align: 'center', width: 120, templet(row) {
                        var value;
                        Object.keys(row).map(item => {
                            if (row[item].gasWatch == 6) {
                                value = row[item].value;
                            }
                        })
                        return value;
                    }
                },
                {
                    field: 'value', title: '大线表', align: 'center', width: 120, templet(row) {
                        var value;
                        Object.keys(row).map(item => {
                            if (row[item].gasWatch == 1) {
                                value = row[item].value;
                            }
                        })
                        return value;
                    }
                },
                {
                    field: 'topDate', title: '中线表', align: 'center', width: 120, templet(row) {
                        var value;
                        Object.keys(row).map(item => {
                            if (row[item].gasWatch == 2) {
                                value = row[item].value;
                            }
                        })
                        return value;
                    }
                },
                {
                    field: 'topValue', title: '辅助', align: 'center', width: 80, templet(row) {
                        var value;
                        Object.keys(row).map(item => {
                            if (row[item].gasWatch == 4) {
                                value = row[item].value;
                            }
                        })
                        return value;
                    }
                },
                {
                    field: 'topValue', title: '大线消耗', align: 'center', width: 120, templet(row) {
                        var value;
                        Object.keys(row).map(item => {
                            if (row[item].gasWatch == 1) {
                                value = row[item].useValue;
                            }
                        })
                        return value;
                    }
                },
                {
                    field: 'topValue', title: '中线消耗', align: 'center', width: 120, templet(row) {
                        var value;
                        Object.keys(row).map(item => {
                            if (row[item].gasWatch == 2) {
                                value = row[item].useValue;
                            }
                        })
                        return value;
                    }
                },
                {
                    field: 'crtUserName', title: '记录人', align: 'center',width: 120, templet(row) {
                        return row['0'].crtUserName

                    }
                },
                {
                    field: '操作', title: '操作', fixed: 'right',width: 150, align: 'center', templet(row) {
                        if (row.storeName) {
                            return `<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" ">删除</a>
                                <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="watch" ">查看截图</a>`
                        } else {
                            return `<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" ">删除</a>`

                        }
                    }
                },
            ]],
            parseData: function (res) {
                return {
                    "code": 0,
                    "msg": "",
                    "count": res.obj.total,
                    "data": res.obj.rows
                }
            }
        });
        form.on('submit(search)',function (form) {
          var range=  form.field.searchDate;
            var temp=range.split(' - ');
            var startTime=temp[0];
            var endTime=temp[1];
            insTb.reload({where:{startTime:startTime,endTime:endTime}});

        });

        /* 监听表单提交 */
        form.on('submit(formAdvSubmit)', function () {
            var westTopVal = parseInt($("#west [name='topValue']").val());
            var westValue = parseInt($("#west [name='value']").val());

            var eastTopValue = parseInt($("#east [name='topValue']").val());
            var eastValue = parseInt($("#east [name='value']").val());

            var bigTopValue = parseInt($("#big [name='topValue']").val());
            var bigValue = parseInt($("#big [name='value']").val());
            // var bigFixValue = parseInt($("#big [name='fixValue']").val());

            var middleTopValue = parseInt($("#middle [name='topValue']").val());
            var middleValue = parseInt($("#middle [name='value']").val());
            var middleFixValue = parseInt($("#middle [name='fixValue']").val());

            var supportValue = parseInt($("#support [name='value']").val());

            var bigUseTotal=0;
            var middleUseTotal=0;

            var topDate = $("[name='topDate']").val();
            var addDate = $("[name='addDate']").val();
            var topTime = $("[name='topTime']").val();
            var addTime = $("[name='addTime']").val();
            var notice = '本次数值必须大于上一次数值';

            var westUse =westValue -westTopVal;
            var eastUse =eastValue - eastTopValue;
            var bigUse = bigValue - bigTopValue;
            var middleUse =middleValue - middleTopValue;
            if (westUse < 0) {
                showAlert('西表：' + notice);
                return
            }
            if (eastUse < 0) {
                showAlert('东表：' + notice);
                return
            }
            if (bigUse < 0) {
                showAlert('大线：' + notice);
                return
            }
            if (middleUse < 0) {
                showAlert('中线：' + notice);
                return
            }
            evalUse();

            var array = [];
            wathcList.map(item => {
                var x = {}
                x.gasWatch = item.dictCode;
                array.push(evalValue(x));

            });

            function evalValue(x) {
                switch (parseInt(x.gasWatch)) {
                    case 1:
                        x.topValue = bigTopValue
                        x.value = bigValue
                        x.useValue=bigUseTotal
                        // x.fixValue = bigFixValue
                        break;
                    case 2:
                        x.topValue = middleTopValue
                        x.value = middleValue
                        x.useValue=middleUseTotal
                        x.fixValue = middleFixValue
                        break;
                    case 4:
                        x.value = supportValue
                        break;
                    case 5:
                        x.topValue = westTopVal
                        x.value = westValue
                        break;
                    case 6:
                        x.topValue = eastTopValue
                        x.value = eastValue
                        break;
                }
                return x;
            }

            function evalUse() {
                //大线消耗：大线差-中线修正
                 bigUseTotal = bigUse - middleFixValue;
                //中线消耗：西差+东差+辅助-大线消耗
                 middleUseTotal = westUse + eastUse + supportValue - bigUseTotal;

                $("#big [name='useValue']").val(bigUseTotal);
                $("#middle [name='useValue']").val(middleUseTotal);
                //开启手动输入消耗
                $("#big [name='useValue']").attr('disabled', false);
                $("#middle [name='useValue']").attr('disabled', false);
            }

            layer.confirm('确认提交？',{offset:['50px','35%']}, function () {
                var param = {array: JSON.stringify(array)};
                param.crtUserAccount = getAccount();
                param.crtUserName = getUserName();
                param.storeName = storeName;
                param.addDate = addDate + " " + addTime;
                param.topDate = topDate + " " + topTime;
                $.post('/report/gasRecord/addGasRecord', param, function (res) {
                    if (res.code == 200) {
                        closeDialog();
                        showAlert('日志已保存', 1);
                        getTopUseLog();
                        insTb.reload();
                        getTopUseLog();
                        return false;
                    } else {
                        showAlert(res.msg);
                    }
                });

            });

        });
        table.on('tool(formAdvTable)', function (obj) {
            if (obj.event == 'del') {
                layer.confirm('确认删除该条日志？', function () {
                    $.post('/report/gasRecord/deleteGasRecord', {addDate: obj.data[0].addDate}, function (res) {
                        if (res.code == 200) {
                            closeDialog();
                            getTopUseLog();
                            showAlert('删除成功', 1);
                            insTb.reload({page: {curr: 1}});
                        } else {
                            showAlert('删除失败');
                        }
                    })
                })
            }
            if (obj.event == 'watch') {
                window.open(BASE_ANNEX + obj.data.storeName + "?token=" + Cookies.get("token"));
            }
        })

        function getGasDict() {
            var param = {};
            param.pDictCode = 'gas';
            var res = doPostSync('/office/tDict/queryChildrenDict', param)
            return res;
        }
    });

    function getTopUseLog() {
        var gasWatchList = wathcList.map(item => {
            return item.dictCode;
        });
        var param = {};
        var lineListStr = gasWatchList.join(',')
        param.lineListStr = lineListStr;
        $.get('/report/gasRecord/getTopUseLog', param, function (res) {
            var topUseLogList = res.obj;
            if (topUseLogList.length != 0) {
                topUseLogList.map(item => {
                    switch (parseInt(item.gasWatch)) {
                        case 1:
                            $("#big [name='topValue']").val(item.value)
                            break;
                        case 2:
                            $("#middle [name='topValue']").val(item.value)
                            break;
                        case 4:
                            $("#support [name='topValue']").val(item.value)
                            break;
                        case 6:
                            $("#east [name='topValue']").val(item.value)
                            break;
                        case 5:
                            $("#west [name='topValue']").val(item.value);
                            return;
                    }

                });
                var addDate = topUseLogList[0].addDate;
                if (addDate.split(" ")[1] == '20') {
                    $("[name='topTime']").val('20:00');
                    $("[name='addTime']").val('8:00');
                } else {
                    $("[name='topTime']").val('8:00');
                    $("[name='addTime']").val('20:00');
                }
                $("[name='topDate']").val(addDate.split(" ")[0]);
                $("[name='addDate']").val(formatDate(new Date()));
                form.render('select')
            }
        })
    }

    function chooseFile() {
        var input = document.createElement("input");
        input.type = "file";
        input.click(); //代码执行到这里，本地文件选择框便会打开！
        input.onchange = function () {
            cbAnnexFile = input.files[0];
            if (cbAnnexFile.name.indexOf('jpeg') == -1 &&
                cbAnnexFile.name.indexOf('png') == -1 &&
                cbAnnexFile.name.indexOf('jpg') == -1) {
                showAlert('请上传:jpeg,jpg,png格式的附件');
                return false;
            }
            $("#annexName").text(cbAnnexFile.name);

            layer.confirm('是否确定上传' + cbAnnexFile.name + '?', function (i) {
                var formData = new FormData();
                formData.append("file", cbAnnexFile);
                var result = uploadFile(formData);
                if (result.code == 200) {
                    storeName = result.obj.storeName;
                    showMsg('上传成功');
                    layer.close(i);
                }
            })
        };
    }


</script>
</body>
</html>
